<template>
	<view class=" ">
		<view class="positopbgc"></view>
		<view class="mainpadding" style="z-index: 10;position: relative;">
			<view class="titletext bold hei_text" style="margin-top: 100rpx;">立即注册</view>
			<view class="pdl" style="margin-top: 50rpx;">
				<input type="text" class=" hei_text main_size bold" placeholder="请输入用户名(用户名唯一)" style="width: 100%;"
					v-model="username">
			</view>
			<view class="pdl margin_top">
				<input type="text" class=" hei_text main_size bold" placeholder="请输入密码" style="width: 100%;"
					v-model="password">
			</view>
			<view class="pdl margin_top">
				<input type="text" class=" hei_text main_size bold" placeholder="请再次输入密码" style="width: 100%;"
					v-model="password_text">
			</view>
			<view class="pdl margin_top">
				<input type="text" class=" hei_text main_size bold" placeholder="请输入用户昵称" style="width: 100%;"
					v-model="nickname">
			</view>
			<view class="pdl margin_top flexbetween">
				<input type="text" class=" hei_text main_size bold" placeholder="请选择性别" style="width: 100%;" disabled>
				<u-radio-group v-model="gender" placement="row" circle>
					<u-radio activeColor="#3478F5" :customStyle="{marginRight: '30rpx'}" label="男" name="1"></u-radio>
					<u-radio activeColor="#3478F5" label="女" name="2"></u-radio>
				</u-radio-group>
				<!-- <u-icon name="arrow-right" color="#999" size="16"></u-icon> -->
			</view>
			<!-- <view class="pdl margin_top flexbetween">
				<uni-data-picker @change="bindPickerChange" :localdata="items" placeholder="请选择住址" popup-title="请选择地区"
					v-model="address.county" class="zdy">
					<input class="" type="text" class="hei_text main_size bold" placeholder="请选择地区" v-model="area"
						disabled="">
				</uni-data-picker>
				<u-icon name="arrow-right" color="#999" size="16"></u-icon>
			</view> -->
			<view class="pdl margin_top flexbetween" @click="pickerdzshow = true">
				<input type="text" class=" hei_text main_size bold" placeholder="请选择城市" v-model="region"
					style="width: 100%;" disabled>
				<u-icon name="arrow-right" color="#999" size="16"></u-icon>
			</view>
			<view class="pdl margin_top">
				<input type="number" class=" hei_text main_size bold" placeholder="请输入找回密码手机号" style="width: 100%;"
					v-model="bind_tel">
			</view>
			<!-- <view class="mainpadding_top flexleft margin_top">
				<view class="nocheckaudio"></view>
				<view class="checkaudio"></view>
				<view class="xiaohui margin_left1">
					阅读并同意
					<text class="xiaolan">《用户协议》</text>
					和
					<text class="xiaolan">《隐私政策》</text>
				</view>
			</view> -->
			<view class="submitbtn margin_top" @click="signIn">立即注册</view>
		</view>
		<pickercity :messageInfo="{pickerdzshow:pickerdzshow}" @surecity="surecity"></pickercity>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	import citys from "@/static/city/city.js"
	export default {
		data() {
			return {
				address: {
					province: "", //省
					city: "", //市
					county: "", //区
				},
				items: citys.data,
				area: "",
				gender: "1",
				password: "",
				password_text: "",
				nickname: "",
				bind_tel: "",
				username: "",
				cityinfo: {},
				region: "",
				pickerdzshow: false

			}
		},
		onLoad() {},
		methods: {
			surecity(e) {
				this.pickerdzshow = false
				if (e) {
					this.cityinfo = e
					this.region = e.provence + "/" + e.city
				}
			},
			signIn() {
				if (this.username == "") {
					httpRequest.toast("请输入用户名");
					return false;
				}
				if (this.password == "") {
					httpRequest.toast("请输入密码")
					return false
				}
				if (this.password_text == "") {
					httpRequest.toast("请输入确认密码")
					return false
				}
				if (this.password_text != this.password) {
					httpRequest.toast("两次密码输入不一致")
					return false
				}
				if (this.nickname=="") {
					httpRequest.toast("请输入昵称")
					return false
				}
				if(this.region==""){
					httpRequest.toast("请选择城市")
					return;
				}
				if (this.bind_tel=="") {
					httpRequest.toast("请输入找回密码手机号")
					return false
				}
				if(!this.isMobile(this.bind_tel)){
					httpRequest.toast("手机号码格式错误!")
					return;
				}
				httpRequest.request('/api/user/register', 'POST', {
					username: this.username,
					password: this.password,
					nickname:this.nickname,
					gender: this.gender,
					bind_tel: this.bind_tel,
					region: this.region,
					province: this.cityinfo.provenceid,
					city: this.cityinfo.cityid,
				}).then(res => {
					if (res.code == 1) {
						httpRequest.toast('注册成功');
						setTimeout(() => {
							uni.navigateBack(1)
						}, 1000)
					} else {
						httpRequest.toast(res.msg);
					}
				})
				// uni.navigateTo({
				// 	url:"/pages/login/userinfo"
				// })
			},
			isMobile(value) {
				let a = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/.test(value); 
				return a;
			},
			jumpurl(url) {
				uni.navigateTo({
					url
				})
			},
			bindPickerChange(val) {
				let area = val.detail.value
				let area_text = [area[0].text, area[1].text, area[2].text];
				this.area = area_text.join("/")
				this.address.province = area[0].value;
				this.address.city = area[1].value;
				this.address.county = area[2].value;
			},
		}
	}
</script>

<style lang="scss" scoped>
	.pdl {
		padding-bottom: 40rpx;
	}

	/deep/.u-radio-group {
		flex: none !important;
	}
</style>